<template>
  <div class="Home">
    <van-sticky>
      <van-search @click="() => {showSearch = !showSearch;}" disabled shape="round" :placeholder="searchdefault">
        <template #left>
          <van-image v-if="userToken" @click="onloginye" fit="cover" round width="1.8rem" height="1.8rem"
            src="https://tse4-mm.cn.bing.net/th/id/OIP-C.BCkm5CTgDI6UbnMcBNP3pQHaEo?w=192&h=120&c=7&r=0&o=5&pid=1.7" />
          <van-image v-else @click="onloginye" fit="cover" round width="1.8rem" height="1.8rem"
            src="https://b.yzcdn.cn/vant/icon-demo-1126.png" />
        </template>
      </van-search>
    </van-sticky>
    <search :searchdefault="searchdefault" :searchhot="searchhot" :showSearch="showSearch"></search>
    <swipe></swipe>
    <hotsale></hotsale>
    <products></products>
    <goods></goods>
    <menubar></menubar>
  </div>
</template>

<script>
  import {
    mapMutations
  } from 'vuex'
  import menubar from '../../components/MenuBar.vue'
  import swipe from './base/Swipe.vue'
  import hotsale from './base/Hot_sale.vue'
  import goods from './base/rmd_goods.vue'
  import products from './base/New_products.vue'
  import search from './base/search.vue'
  import router from '@/router'
  export default {
    name: 'hoMe',
    data() {
      return {
        searchdefault: '搜索一下吧',
        searchhot: [],
        showSearch: false,
        searchTilie: '',
        userToken: localStorage.getItem('userToken') || ''
      }
    },
    components: {
      menubar,
      swipe,
      hotsale,
      goods,
      products,
      search
    },
    methods: {
      onloginye() {
        router.push('/Login')
      },
      ...mapMutations(['SET_HOME_CONFIG']),
      get_Home_config() {
        this.$api.homeData.home_config().then(res => {
          res = res.data
          this.searchdefault = res.filter(x => x.type === 1)
          this.searchdefault = this.searchdefault[0].name
          this.searchhot = res.filter(x => x.type === 2)
        })
      }
    },
    created() {
      this.get_Home_config()
      sessionStorage.setItem('active', 0)
    },
    mounted() {
      if (this.userToken === '') {
        this.$toast('客官您还未登陆、左上角可以登录哦')
      }
    }
  }
</script>

<style>
  .Home {
    background-color: #eeeeee70;
  }

  .van-nav-bar-title {
    width: 60vw;
    height: 36px;
    background-color: #eee;
    border-radius: 5vw;
    line-height: 36px;
    font-size: 80%;
    color: #888;
  }
</style>
